<template>
	<view class="content-box">
		<view class="content-ul nl-shadow-box">
			<view class="nl-flex-list active" @click="auditShow = true">
				<view>审核</view>
				<view class="right" :class="auditName != '请选择' ? 'selected':'unselected'">{{auditName}}</view>
				<u-icon name="arrow-right" color="#414141" size="28"></u-icon>
			</view>
			<view class="nl-flex-list">
				<view>处理意见</view>
			</view>
			<view class="textarea-padding">
				<u-input v-model="finishInfo.remark" type="textarea" border="true"  />
			</view>
			<view class="button-lg" @click="complaintsFinish">
				<button>提交</button>
			</view>
		</view>

		<!-- 审核-->
			<u-select confirm-color="#1585FC" v-model="auditShow" mode="single-column" :list="auditInfo"
				@confirm="confirmAudit()"></u-select>
	</view>
</template>

<script>
	import {
		auditComplaint
	} from 'api/complaint.js';
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				auditShow: false,
				finishInfo: {
					remark: '',
					state: '',
				},
				taskId: '',
				auditName: '请选择',
				complaintId: '',
				auditInfo: [{
						value: '1100',
						label: '同意'
					},
					{
						value: '1200',
						label: '拒绝'
					}
				],
			}
		},
		onLoad(option) {
			console.log(option)
			this.taskId = option.taskId
			this.complaintId = option.complaintId
			this.finishInfo.roomId = option.roomId
		},
		computed: {
			...mapState('user', ['userInfo', 'userCommunity'])
		},
		methods: {
			/**
			 * 提交
			 */
			complaintsFinish() {
				let pages = getCurrentPages(); // 当前页面
				let beforePage = pages[pages.length - 2]; // 上一页
				if (!this.checkData()) { //校验
					return;
				}
				const data = {
					remark: this.finishInfo.remark,
					state: this.finishInfo.state,
					taskId: this.taskId,
					complaintId: this.complaintId,
					storeId: this.userInfo.storeId,
					userName: this.userInfo.userName,
					userId: this.userInfo.userId,
					communityId: this.userCommunity.communityId,
					complaintState:this.finishInfo.state,
					roomId:this.finishInfo.roomId,
				}
				auditComplaint(data).then(res => {
					beforePage.onLoad()
					uni.showToast({
						title: "提交成功",
						icon: "success",
						success() {
							uni.navigateBack()
						}
					})
				}).catch(err => {
					uni.showToast({
						title: "网络异常~",
						icon: "none",
					})
				})

			},
			/**
			 * 确认审核
			 */
			confirmAudit(e) {
				this.auditName = e[0].label
				this.finishInfo.state = e[0].value
			},
			// 校验
			checkData() {
				return this.$checkFrom({
					finishInfo: this.finishInfo
				}, {
					'finishInfo.state': [{
						limit: "required",
						param: "",
						errInfo: "请选择审核类型"
					}],
					'finishInfo.remark': [{
						limit: "required",
						param: "",
						errInfo: "请输入处理意见"
					}],
				});
			},
		}
	}
</script>

<style>
	.unselected {
		color: #AFAFAF;
		margin-right: 10rpx;
		letter-spacing:5rpx;
	}

	.selected {
		color: #000;
		margin-right: 10rpx;
		letter-spacing:5rpx;
	}

	.content-box {
		padding: 24rpx 32rpx;
	}

	.textarea-padding {
		padding: 0 24rpx;
	}
</style>
